import React, { useRef, useState, useEffect } from 'react';
import { connect, history } from 'umi';
import { Row, Col, Card, Tooltip, Button, Space, Modal, notification } from 'antd';
import TableDataBlock from '@/components/TableDataBlock';
import { uploadFile, } from '@/utils/utils'
import request from 'axios';
const AnsweringnUserNumber = (props) => {
    const { loading, dispatch, list, departmentList, teamList } = props;
    const childRef = useRef();
    const { location = {} } = history;
    const { pathname, query } = location;
    const { accessId } = query;
    const searchItems = [
        {
            label: '客户姓名或手机',
            name: 'keyword',
        },
        {
            label: '毕业年份',
            name: 'examYear',
            type: 'select',
            select: {
                2023: 2023,
                2024: 2024,
                2025: 2025,
                2026: 2026,
                2027: 2027,
                2028: 2028,
            }
        },
    ];
    const getColumns = [
        {
            title: '用户名',
            dataIndex: 'username',
        },
        {
            title: '手机号',
            dataIndex: 'mobile',
        },
        {
            title: '毕业年份',
            dataIndex: 'examYear',
        },
        {
            title: '剩余答疑次数',
            dataIndex: 'qaAmount',
            sorter: true
        },
        {
            title: '累计已答疑次数',
            dataIndex: 'totalQaAmount',
            sorter: true
        },
        {
            type: 'handle',
            width: 200,
            dataIndex: 'id',
            render: (val, record) => [
                {
                    auth: true,
                    title: '次数明细',
                    click: () => {
                        history.push({
                            pathname: '/answeringModule/answeringUserRecord',
                            query: {
                                id: val,
                                accessId
                            }
                        })
                    },
                },
                {
                    auth: true,
                    title: '详情',
                    click: () => {
                        history.push({
                            pathname: '/userModule/userDetail',
                            query: {
                                id: val,
                                accessId
                            }
                        })
                    },
                },
            ],
        },
    ];
    const handleCallback = () => {
        childRef.current.fetchGetData();
    };
    const importUserExcelTemplate = () => {
        uploadFile('https://resource.gy.cn/importUserQaAmountTemplate/%E5%AF%BC%E5%85%A5%E6%AC%A1%E6%95%B0%E6%A8%A1%E6%9D%BF.xlsx')
    }
    const inputFile = async () => {
        const options = {
            types: [
                {
                    description: 'Excel Files',
                    accept: {
                        'application/vnd.ms-excel': ['.xls'],
                        'application/vnd.openxmlformats-officedocument.spreadsheetml.sheet': ['.xlsx']
                    }
                }
            ],
            multiple: false
        };

        try {
            window.showOpenFilePicker(options).then(async val => {
                const [fileHandle] = val
                fileHandle.getFile().then(data => {
                    const formData = new FormData();
                    formData.append('file', data);
                    formData.append('token', window.localStorage.getItem('token'));
                    request.post(APIURL + '/userQa/importUserQaAmount', formData, {
                        headers: {
                            'Content-Type': 'multipart/form-data',
                            appType: 'organization',
                            device: 'web',
                            Accept: 'application/json',
                        },
                    }).then(val => {
                        const { data = {},
                        } = val
                        const { resultCode, resultDesc, content = {} } = data
                        console.log(data)
                        if (resultCode === '1') {
                            const { url } = content
                            Modal.confirm({
                                title: '导入结果',
                                content: '导入次数成功，点击下载查看导入结果',
                                okText: '下载',
                                onOk() {
                                    uploadFile(url)
                                },
                                onCancel() {
                                    console.log('Cancel');
                                },
                            })
                            handleCallback()
                        }
                        else {
                            notification.error({
                                message: `请求错误`,
                                description: resultDesc,
                            });
                        }

                    })
                })

            })
        } catch (error) {
            // 处理错误
            console.log(error)
        }
    }
    return <Card
        extra={<Space>

            <Button type='link' onClick={() => inputFile()}>导入次数</Button>
            <Button type='link' onClick={() => importUserExcelTemplate()}>下载导入模板</Button>
        </Space>}
        title={'答疑次数'}>
        <TableDataBlock
            searchItems={searchItems}
            cRef={childRef}
            loading={loading}
            columns={getColumns}
            rowKey={(e) => {
                return e.id
            }}
            sortConfig={{
                sortConstant: {
                    qaAmount: 'qa_amount',
                    totalQaAmount: 'total_qa_amount',
                }
            }}
            dispatchType="subscriber/fetchSearchUser"
            {...list}
        ></TableDataBlock>

    </Card>
}
export default connect(({ loading, subscriber }) => ({
    list: subscriber.list,
}))(AnsweringnUserNumber);
